|
|
![]() |
The < Adam Argyle |
How to Think About Baseline and Polyfills — Despite polyfills not being included as part of the Baseline project, Baseline can still help bring some nuance to the decision making around whether or not to use them. Jeremy Wagner |
![]() 2X-40X Faster Docker Builds with Blacksmith — With a one-line code change, Blacksmith can make your Docker builds incremental by mounting your Docker layer cache into your GitHub Actions runner. Blacksmith is used by 300+ companies like Ashby, Clerk, and Mintlify. Blacksmith sponsor |
Support Logical Shorthands in CSS — The CSS Working Group recently resolved to add a size shorthand for setting both the width and height of an element. Many people asked about using it to set the ‘logical’ Miriam Suzanne |
![]() |
Minding the Gaps: A New Way to Draw Separators in CSS — Explains CSS gap decorations, a new proposal being worked on (and seeking feedback) for adding and extending fine-tune control over gap decorations. Babbitt & Brosset (Microsoft) |
|
📙 Articles, Opinions & Tutorials |
![]() |
Revisiting CSS Andy Clarke |
Meet Clerk sponsor |
The Bare Minimum You Need to Enable View Transitions on Your Site — View transitions are a solid way to make your site feel more dynamic and engaging when folks are navigating between pages. Here’s the basics for getting started. Amit Merchant |
![]() |
Layered Text Headers — Applying a stroke effect to text across all browsers is possible, but as Chris points out it makes use of a center-aligned look which “looks like 💩” (his words). However, the Chris Coyier |
Previewing Content Changes in Your Work with Victor Ayomipo |
Best Practices for Cognitive Accessibility in Web Design — Lots of good practical advice here, covering ways to improve your website’s cognitive accessibility. Caitlin de Rooij |
25 Ridiculously Impressive HTML5 Canvas Experiments
|
Why Do We Have a Cache-Control Request Header?
|
Downtime vs 'Slowtime': Which Costs You More?
|
🧰 Tools, Code & Resources |
![]() |
An MCP Server for Playwright and Browser Automation — MCP (Model Context Protocol) servers enable certain LLM-based agents (such as Claude, Claude Code, and Cursor) to perform actions on a system outside of their usual sandbox. This new project from Microsoft enables such LLMs to interact with Web pages in a structured way (much as Playwright lets you do from Python or JavaScript code). Microsoft |
CASCII: A Web-Based ASCII and Unicode Diagram Builder — Imagine something like MS Paint but for text-based drawing. You can switch between ASCII and Unicode modes and enable a background grid for alignment. Export directly to clipboard or in Base64. Caspar Wylie |
Introducing Figma to Bolt — Turn Figma designs into pixel-perfect full stack apps in one click. bolt.new sponsor |
Konva: A JavaScript 2D Canvas Library — The native API for Canvas elements is pretty good, but Konva is a popular abstraction that sits on top and provides a more structured way to work with shapes, styling, events, animations, and more (lots of demos with code). It also has extra integration libraries for Vue, Svelte and React. Konva |
Reveal.js 5.2: The HTML Presentation Framework — Brings elegant presentations to anyone with a Web browser. v5.2 adds the ability to trigger ‘lightboxes’ where viewers can see images and videos in a way where they stand out more. Hakim El Hattab |
|
Parvus 3.0: Accessible Lightbox with No Dependencies — I love how it says not to use overlays on web pages but if you have to, use this! There’s a CodePen example. Benjamin de Oostfrees |
Fancy Components: A Growing Library of Ready-to-Use Animated React Components — Includes a whole slew of components for doing various text animations, along with others for backgrounds, physics-related animations, SVG filters, and more. Try them out here. Daniel Petho |
StringTune: The JavaScript Library Born from a Design Agency’s Workflow — A look at how to make use of this flexible JavaScript library for animations, smooth scrolling, and interactive effects. npm package. Fiddle.Digital |
Cursorful: A Screen Recording Browser Extension with Cursor-Following Zoom
|
MetaCheck: Preview Your Site’s OG Images, Meta Tags, Favicon, and More
|